<meta name="viewport" content="width=device-width, initial-scale=1.0">
<?php
echo $this->headScript()->
        appendFile($this->baseUrl() . "/js/jquery-1.7.1.js")->
        appendFile($this->baseUrl() . "/js/jquery.validate.js")->
        appendFile($this->baseUrl() . "/js/createnewaccount.js")->
        appendFile($this->baseUrl() . "/js/common.js")->
        appendFile($this->baseUrl() . "/css/bootstrap/dist/js/bootstrap.min.js");
echo $this->headLink()
        ->setIndent('  ')
        ->prependStylesheet($this->baseUrl() . "/css/bootstrap/dist/css/bootstrap.min.css")
        ->prependStylesheet($this->baseUrl() . "/css/bootstrap/dist/css/bootstrap-theme.min.css");
?>
<style type="text/css">
    body
    {
        background-color: #1b1b1b;
        padding-top: 10px;
    }
    .form-control:focus
    {
        background-color: rgb(50, 118, 177);
        border-color: rgb(40, 94, 142);
        color: rgb(255, 255, 255);
    }
    .form-signup input[type="text"],.form-signup input[type="password"] { border: 1px solid rgb(50, 118, 177); }
</style>

<div class="container">
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
            <div class="panel panel-default">
                <div class="panel-body">
                    <h5 class="text-center">
                        <strong>NUEVA CUENTA</strong>
                    </h5>
                    <form id="form-new" class="form form-signup" role="form">
                        <div class="row">    
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Nombre de usuario</strong></h5>
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <input id="username" name="username" type="text" class="form-control" placeholder="Nombre de Usuario" value="<?php echo $this->username; ?>" />
                                </div>    
                            </div>
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Email</strong></h5>
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <input id="email" name="email" type="text" class="form-control" placeholder="Email" value="<?php echo $this->email; ?>" />
                                </div>
                            </div>
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Nombre</strong></h5>            
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <input id="nombre" name="nombre" type="text" class="form-control" placeholder="Nombre" value="<?php echo $this->nombre; ?>"/>
                                </div>
                            </div>
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Apellido</strong></h5>            
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <input id="apellido" name="apellido" type="text" class="form-control" placeholder="Apellido" value="<?php echo $this->apellido; ?>"/>
                                </div>        
                            </div>    
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Contrase&ntilde;a</strong></h5>            
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">                                    
                                    <input id="password" name="password" type="password" class="form-control" placeholder="Contrasena" />
                                </div>
                            </div>
                            <div class="row-fluid">
                                <div class="col-md-12 col-sm-12 col-xs-12">
                                    <h5><strong>Repetir Contrase&ntilde;a</strong></h5>            
                                </div>
                                <div class="col-md-12 col-sm-12 col-xs-12">                                                                
                                    <input id="password_confirm" name="password_confirm" type="password" class="form-control" placeholder="Repetir Contrasena" />                                
                                </div>
                            </div>                                                         
                            
                            <div class="row-fluid">
                                
                            </div>
                        </div> 
                        <br>                        
                        <div id="div-alert" ></div>                        
                        <a id="btncrear" href="#" class="btn btn-sm btn-primary btn-block" role="button"><strong>Crear Nueva Cuenta</strong></a>                         
                        <a id="btncancelar" href="/" class="btn btn-sm btn-primary btn-block" role="button"><strong>Cancelar</strong></a> 
                    </form>                     
                </div>
            </div>
        </div>
    </div>
</div>